<template>
    <div class="userManage">
        <!--文章列表-->
      <Card>
        <div class="list-manger">
            <row type="flex" justify="space-around" class="code-row-bg">
                <i-col span="15">
                    <List>
                        <ListItem v-for="item in list" :key="item.id" class="item">
                            <ListItemMeta :title="item.username"/>
                            <template slot="action">
                                <li>
                                    <Button type="error" v-on:click="del(item.username)">删除用户</Button>
                                </li>
                            </template>
                        </ListItem>
                    </List>
                </i-col>
            </row>
        </div>
      </Card>
    </div>
</template>

<script>
    export default {
        name: 'AdminUsers',
        components: {},
        data() {
            return {
                list: [],
            }
        },
        created: function () {
            this.getUsers()
        },
        methods: {
            del(username) {
              if (username === 'admin') {
                this.$Notice.info({
                  title: '提示',
                  desc: '管理员账号不可删除',
                })
              } else {

                  var msg = "您真的确定要删除吗？\n\n请确认！";
                  if (confirm(msg)==true){
                    this.$api.get('admin/stopLogin/' + username).then((res) => {
                      this.$Notice.info({
                        title: '提示',
                        desc: res.message
                      })
                      this.getUsers()
                    });
                    return true;
                  }else{
                    alert('取消删除');
                    return false;
                  }

              }
            },
            getUsers() {
                //获取所有用户
                this.$api.get('admin/getAllUser').then((res) => {
                    this.list = res.data
                })
            }
        }
    }
</script>
<style>
.list-manger{
  color: rgb(255,255,255);
}

  .userManage{
    width: 65%;
    margin: 20px auto;
  }
</style>